	.index-top-box {
		overflow: hidden;
		background-color: #effef9;
	}

	.index-icon {
		font-size: 44rpx;
		font-weight: bold;
		margin-right: 5px;
	}

	.index-title {
		width: 110rpx;
		height: 40rpx;
		background: url(static/index-title.png);
		background-size: 100% 100%;
	}

	.index-top {
		display: flex;
		margin-top: 10px;
	}

	.index-intro {
		font-size: 12px;
		color: #4c4949;
		line-height: 2;
		margin-left: 8px;
	}

	.index-address {
		line-height: 1.85;
		justify-content: space-between;
		overflow: hidden;
	}

	.add-icon {
		font-size: 12px;
		color: #000;
	}

	.adress-box {
		justify-content: space-between;
		width: 300rpx;
		margin-left: 5px;
	}

	.address-title {
		font-size: 12px;
	}

	.address-icon {
		font-size: 18px;
		line-height: 1.2;
	}

	.index-ticket {
		background-color: #F7F7F7;
		padding: 0 5px;
		border-radius: 50%;
		color: pink;
	}

	.classify {
		display: grid;
		grid-template-columns: repeat(4, 22.5%);
		grid-template-rows: repeat(1, 200rpx);
		grid-gap: 10px;
	}

	.mod {
		flex-wrap: wrap;
		border-radius: 15px;
		border-top-left-radius: 25px;
		overflow: hidden;
	}

	.daily {
		box-shadow: 0px 0px 5px 0px #ffaa00;
		background-color: #fd8419;
	}

	.classify-img {
		height: 60%;
		background: url(static/01.png);
		background-size: 100% 100%;
	}

	.classify-img2 {
		height: 60%;
		background: url(static/02.png);
		background-size: 100% 100%;
	}

	.classify-img3 {
		height: 60%;
		background: url(static/03.png);
		background-size: 100% 100%;
	}

	.classify-img4 {
		height: 60%;
		background: url(static/04.png);
		background-size: 100% 100%;
	}

	.deep {
		background-color: #2e9cfe;
		box-shadow: 0px 0px 5px 0px #007AFF;
	}

	.month {
		background-color: #7868e5;
		box-shadow: 0px 0px 5px 0px #B500FE;
	}

	.care {
		background-color: #44c19f;
		box-shadow: 0px 0px 5px 0px #1EA448;
	}

	.classify-title {
		color: #fff;
		font-weight: bold;
		text-align: center;
		margin-top: 5px;
		font-size: 27rpx;
	}

	.classify-intro {
		font-size: 12px;
		background-color: #fff;
		border-radius: 15px;
		text-align: center;
		width: 150rpx;
		margin: 5px auto 0;
	}

	.intro-daily {
		color: #ffaa00;
	}

	.intro-deep {
		color: #007AFF;
	}

	.intro-month {
		color: #B500FE;
	}

	.intro-care {
		color: #1EA448;
	}

	.job-classify {
		flex-wrap: wrap;
		background-color: #fff;
		border-radius: 15px;
		margin-top: 10px;
		text-align: center;
		padding-bottom: 10px;
		box-shadow: 0 0 2px 1px #F5F2F0;
	}

	.job-mod {
		width: 20%;
		margin-top: 20px;
	}

	.job-mod-title {
		font-size: 20rpx;
		margin-top: 10rpx;
	}

	.index-banner {
		padding: 5px 0 10px 0;
	}

	.banner-img {
		height: 140rpx;
		background: url(static/index-banner.jpg);
		background-size: 100% 100%;
	}

	.i-banner {
		border-radius: 15px;
		overflow: hidden;
		box-shadow: 0 0 2px 1px #f5f2f0;
		box-sizing: border-box;
		background-color: #FFFFFF;
	}

	.i-banner-wrap {
		padding: 10px 10px 0 10px;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.banner-mod {
		width: 48%;
		justify-content: space-between;
		margin-bottom: 10px;
		border-radius: 15px;
		overflow: hidden;
	}

	.banner-mod:nth-child(1) {
		background-color: #eef5ff;
	}

	.banner-mod:nth-child(2) {
		background-color: #fbf8f3;
	}

	.banner-mod:nth-child(3) {
		background-color: #ecf7fb;
	}

	.banner-mod:nth-child(4) {
		background-color: #fdf4f7;
	}

	.banner1 {
		width: 40%;
		height: 100%;
		background: url(static/index-banner1.png);
		background-size: 100% 100%;
	}

	.banner2 {
		width: 40%;
		height: 100%;
		background: url(static/index-banner2.png);
		background-size: 100% 100%;
	}

	.banner3 {
		width: 40%;
		height: 100%;
		background: url(static/index-banner3.png);
		background-size: 100% 100%;
	}

	.banner4 {
		width: 40%;
		height: 100%;
		background: url(static/index-banner4.png);
		background-size: 100% 100%;
	}

	.banner-title {
		margin: 10px 0 0 7px;
		font-size: 28rpx;
	}

	.banner-title-intro {
		margin: 3px 0 15px 7px;
		font-size: 16rpx;
		color: #969896;
	}

	.banner-title-icon1 {
		margin-left: 10px;
		color: #B3D4FC;
		font-size: 18rpx;
		line-height: 2;
	}

	.banner-title-icon2 {
		margin-left: 10px;
		color: #E7E1CD;
		font-size: 18rpx;
		line-height: 2;
	}

	.banner-title-icon3 {
		margin-left: 10px;
		color: #aaaaaa;
		font-size: 18rpx;
		line-height: 2;
	}

	.banner-title-icon4 {
		margin-left: 10px;
		color: #ded9c6;
		font-size: 18rpx;
		line-height: 2;
	}

	.broadcast {
		font-size: 20rpx;
		padding: 35rpx 0 15rpx 0;
	}

	.broad-icon {
		margin: 0 5px;
	}


	.index-footer {
		background-color: #f3f3f3;
		overflow: hidden;
	}
	
	.index-footer-nav {
		height: 150rpx;
	}
	
	.footer-father {
		background-color: #f3f3f3;
		margin: 0 5px;
		overflow: auto;
		&::-webkit-scrollbar {
			width: 0;
			height: 0;
		}
	}
	
	.footerFatherFixed {
		position: fixed;
		top: 86rpx;
		background-color: #f3f3f3;
		margin: 0 5px;
		overflow: auto;
		z-index: 999;
		&::-webkit-scrollbar {
			width: 0;
			height: 0;
		}
	}
	
	.topfixed-active {
		width: 100%;
		position: fixed;
		// top: 44px;/* 顶部导航栏位置 */
		top: 44px;/* 顶部导航栏还有其他盒子 使用  */
		left: 0;
		box-sizing: border-box;
	}
	
	.footer-title-box {
		display: flex;
		width: 112%;
		margin-top: 13px;
	}
	
	.f-title-item {
		width: 21%;
	}
	
	.f-title-intro {
		text-indent: 20rpx;
		font-size: 15rpx;
		color: #888;
	}

	.opction-img {
		width: 80rpx;
		height: 40rpx;
		margin-left: 29rpx;
	}
	
	.opction-mod {
		width: calc(100% - 10px);
		background-color: #FFFFFF;
		box-sizing: border-box;
		margin-bottom: 10px;
	}

	.opction-pad {
		padding: 7px;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
	}

	.content-top {
		position: relative;
		justify-content: space-between;
		height: 80%;
	}

.float {
	position: absolute;
	top: 5rpx;
	left: -2px;
	padding: 2px 10px 2px 4px ;
	background: linear-gradient(to right,#ffdfb0,#fef2da);
	border-radius: 0 15px 15px 0;
	z-index: 99;
	color: #9f7543;
	font-weight: bold;
	text-align: center;
	font-size: 12rpx;
	&::before {
		content: '';
		position: absolute;
		top: 30rpx;
		left: 0px;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 2px 2px 0;
		border-color: transparent #ddd3bf transparent transparent;
	}
}

	.opction-imgURL {
		width: 55%;
		height: 255rpx;
		border-radius: 3px;
		overflow: hidden;
	}

	.opc-r-box {
		flex-direction: column;
		justify-content: space-between;
		width: 43%;
		height: 260rpx;
	}

	.opc-r-top {
		height: 51%;
	}

	.opction-opc2URL {
		height: 44.5%;
		border-radius: 3px;
	}
	
	.opc-bottom {
		justify-content: space-between;
	}
	
	.opc-mod-bottom {
		margin-top: 3px;
	}
	
	.opc-mod-tag {
		font-size: 15rpx;
		padding: 1px;
		color: #59b195;
		border: 1px solid #59b195;
	}
	
	.opcModTagFlag {
		color: #fff;
		border: 0;
		background-color: #59b195;
	}
	
	.opc-mod-title {
		color: #333333;
		font-weight: 600;
		font-size: 35rpx;
		letter-spacing: .5px;
		margin-left: 2px;
	}
	
	.opc-mod-basic {
		margin-top: 3px;
	}
	
	.opc-mod-ticket {
		font-size: 12rpx;
		font-weight: bold;
	}
	
	.opc-price {
		font-weight: bold;
	}
	
	.opc-mod-price {
		color: #FFFFFF;
		font-weight: bold;
		background-color: red;
		padding: 1px 2px;
	}
	
	.opc-price-limit {
		font-size: 12rpx;
	}
	
	.opc-mod-delPrice {
		font-size: 12rpx;
		text-decoration: line-through;
		margin-left: 3px;
		color: #666;
	}
	
	.opc-mod-subPrice {
		width: 125rpx;
		text-align: center;
		font-size: 12rpx;
		color: red;
		border-radius: 0 2px 2px 2px;
		border: 1px solid red;
		margin: 4px 0 0 3px;
	}
	
	.subPrice {
		padding: 1px 5px;
	}
	
	.opc-mod-shade {
		height: 100%;
		border: .5px dashed red;
		margin: 0 2px;
	}
	
	.opc-mod-shop {
		align-self: flex-end;
		background-color: #59b195;
		color: #FFFFFF;
		padding: 4px 7px;
		font-size: 28rpx;
	}